// 文章详情页
.details-content {
  margin-top: 100px;
  // 白色
  .bg-white {
    background-color: #fff;
  }
  // 圆角边框
  .ber-ras {
    border-radius: 5px;
  }
  .body {
    width: 87%;
    margin: 0 auto;
    // 标题
    .title {
      padding: 20px;
      h2 {
        font-size: 1.8rem;
        letter-spacing: 3px;
      }
      // 图标栏
      .icon {
        margin-top: 10px;
        color: #888;
        font-size: 17px;
        span {
          // 图标
          .anticon {
            margin-right: 5px;
          }
          margin-right: 20px;
        }
      }
    }
    // 导航
    .ant-breadcrumb {
      margin-top: 20px;
      padding: 10px 20px;
      font-size: 1.05rem;
      background-color: #e1f0ff;
      border: 3px solid #fff;
      // 图标大小
      .anticon {
        font-size: 17px;
      }
    }
    // 行
    .ant-row {
      margin-top: 20px;
      // 列
      .ant-col {
        border-radius: 2px;
        // 代码
        code {
          display: block;
          padding: 10px;
          background-color: #333;
          color: #a6e22e;
          border-radius: 5px;
          overflow-y: auto;
          font-family: Menlo, monospace;
        }
      }
      // 左列
      .left {
        padding: 20px;
      }
      // 右侧
      .right {
        .outline {
          padding: 20px 10px;
          h3 {
            padding-left: 5px;
            background-color: #e1f0ff;
            border: 3px solid #fff;
            font-size: 1.5rem;
            letter-spacing: 3px;
          }
          // 大纲
          .markdown-navigation {
            // 单行显示, 大纲标题
            .title-anchor {
              padding-top: 5px;
              padding-bottom: 5px; 

              white-space: nowrap;
              text-overflow: ellipsis;
              overflow: hidden;

              letter-spacing: 0.5px;
            }
          }
        }
      }
    }
  }

  // 小于 1200 时，body 宽度提高
  @media screen and (max-width: 1200px) {
    .body {
      width: 90%;
    }
  }
}